<%@ page language="java" import="java.util.*" contentType="text/html"
	pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ page language="java" import="com.server.web.JsVersionUtil"%>
<!DOCTYPE html>
<html>
<head>
<title>Home</title>
<link href="css/bootstrap.css" rel='stylesheet' type='text/css' />
<link href="css/owl.carousel.css" rel="stylesheet">
<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<script src="js/jquery.min.js"></script>
<script src="js/modernizr.custom.js"></script>
<!-- Custom Theme files -->
<link href="css/style.css" rel="stylesheet" type="text/css" media="all" />
<link rel="stylesheet" href="css/lightbox.css" type="text/css" media="all" />
<!-- Custom Theme files -->
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="keywords" content="Interior Design Responsive web template, Bootstrap Web Templates, Flat Web Templates, Andriod Compatible web template, 
Smartphone Compatible web template, free webdesigns for Nokia, Samsung, LG, SonyErricsson, Motorola web design" />
<script type="application/x-javascript"> addEventListener("load", function() { setTimeout(hideURLbar, 0); }, false); function hideURLbar(){ window.scrollTo(0,1); } </script>
<!-- for bootstrap working -->
		<script src="js/bootstrap.js"></script>
<!-- //for bootstrap working -->
<!-- web fonts -->
<link href='https://fonts.googleapis.com/css?family=Open+Sans:400,300,300italic,400italic,600,600italic,700,700italic,800,800italic' rel='stylesheet' type='text/css'>
<!-- responsiveslides -->
	<script src="js/responsiveslides.min.js"></script>
		<script>
			// You can also use "$(window).load(function() {"
			$(function () {
		    // Slideshow 4
			$("#slider4").responsiveSlides({
			auto: true,
			pager: true,
			nav: true,
			speed: 500,
			namespace: "callbacks",
			before: function () {
			$('.events').append("<li>before event fired.</li>");
				},
				after: function () {
				$('.events').append("<li>after event fired.</li>");
				}
				});
				});
	</script>
<!-- responsiveslides -->
 <script type="text/javascript">
		jQuery(document).ready(function($) {
			$(".scroll").click(function(event){		
				event.preventDefault();
				$('html,body').animate({scrollTop:$(this.hash).offset().top},1200);
			});
		});
	</script>
</head>
<body>
	<!-- header-section-starts -->	
	<div class="header" id="header">
		<div class="header-top">
			<div class="container">
				<p class="location"><span class="glyphicon glyphicon-map-marker" aria-hidden="true"></span>29C, Autem quibusdam debitis.</p>
				<p class="phonenum"><span class="glyphicon glyphicon-earphone" aria-hidden="true"></span>+ 655 8858 2068 54892</p>
				<div class="social-icons">
					<ul>
						<li><a href="#"><i class="facebook"> </i></a></li>
						<li><a href="#"><i class="twitter"> </i></a></li>
						<li><a href="#"><i class="google-plus"> </i></a></li>	
						<li><a href="#"><i class="dribble"> </i></a></li>										
					</ul>
				</div>
				<div class="clearfix"></div>
			</div>
		</div>
		<div class="header-bottom">
		<div class="logo text-center">
				<h1><a href="index.html">Interior Design</a></h1>
			</div>
			<!-- navigation -->
<div class="navigation">
	<div class="container">
		<nav class="navbar navbar-default">
		 
			<!-- Brand and toggle get grouped for better mobile display -->
			<div class="navbar-header">
			  <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
				<span class="sr-only">Toggle navigation</span>
				<span class="icon-bar"></span>
				<span class="icon-bar"></span>
				<span class="icon-bar"></span>
			  </button>
			</div>

			<!-- Collect the nav links, forms, and other content for toggling -->
			<div class="collapse navbar-collapse nav-wil" id="bs-example-navbar-collapse-1">
				  <ul class="nav navbar-nav">
					<li class="active"><a href="index.html">Home <span class="sr-only">(current)</span></a></li>
					<li><a href="about.html">About</a></li>
					<li><a href="typography.html">Short Codes</a></li>
					<li><a href="gallery.html">Gallery</a></li>
					<li><a class="scroll" href="#blog">Blog</a></li>
					<li><a href="contact.html">Contact Us</a></li>
				  </ul>
			  <div class="clearfix"></div>
			</div><!-- /.navbar-collapse -->
		</nav>
	</div>
</div>
<!-- //navigation -->


				<div class="clearfix"></div>
			</div>

	</div>
	<div class="screen-shots">
					<!--sreen-gallery-cursual-->
						<div class="sreen-gallery-cursual">
							<!-- start content_slider -->
						       <div id="owl-demo" class="owl-carousel">
					                <div class="item">
					                	<div class="item-grid">
					                		<div class="item-pic">
					                			<img src="images/t1.jpg" alt="" />
												<div class="item-text text-center">
													<p class="s-para">The standard chunk</p>
													<h5 class="s-heading">Lorem Ipsum is simply dummy text printing </h5>
												</div>
					                		</div>
					                	</div>
					                </div>
					                <div class="item">
					                	<div class="item-grid">
					                		<div class="item-pic">
					                			<img src="images/t2.jpg" alt="" />
												<div class="item-text text-center">
													<p class="s-para">The standard chunk</p>
													<h5 class="s-heading">Lorem Ipsum is simply dummy text printing </h5>
												</div>
                                               </div>
					                		</div>
					                </div>
					                 <div class="item">
					                	<div class="item-grid">
					                		<div class="item-pic">
					                			<img src="images/t3.jpg" alt="" />
												<div class="item-text text-center">
													<p class="s-para">The standard chunk</p>
													<h5 class="s-heading">Lorem Ipsum is simply dummy text printing </h5>
												</div>
                                               </div>
					                		</div>
					                	</div>
					               <div class="item">
					                	<div class="item-grid">
					                		<div class="item-pic">
					                			<img src="images/t4.jpg" alt="" />
												<div class="item-text text-center">
													<p class="s-para">The standard chunk</p>
													<h5 class="s-heading">Lorem Ipsum is simply dummy text printing </h5>
												</div>
                                               </div>
					                		</div>
					                	</div>
					                 <div class="item">
					                	<div class="item-grid">
					                		<div class="item-pic">
					                			<img src="images/t1.jpg" alt="" />
												<div class="item-text text-center">
													<p class="s-para">The standard chunk</p>
													<h5 class="s-heading">Lorem Ipsum is simply dummy text printing </h5>
												</div>
                                               </div>
					                		</div>
					                	</div>
					                 <div class="item">
					                	<div class="item-grid">
					                		<div class="item-pic">
					                			<img src="images/t2.jpg" alt="" />
												<div class="item-text text-center">
													<p class="s-para">The standard chunk</p>
													<h5 class="s-heading">Lorem Ipsum is simply dummy text printing </h5>
												</div>
                                               </div>
					                		</div>
					                	</div>
					               <div class="item">
					                	<div class="item-grid">
					                		<div class="item-pic">
					                			<img src="images/t3.jpg" alt="" />
												<div class="item-text text-center">
													<p class="s-para">The standard chunk</p>
													<h5 class="s-heading">Lorem Ipsum is simply dummy text printing </h5>
												</div>
                                               </div>
					                		</div>
					                	</div>
					                 <div class="item">
					                	<div class="item-grid">
					                		<div class="item-pic">
					                			<img src="images/t4.jpg" alt="" />
												<div class="item-text text-center">
													<p class="s-para">The standard chunk</p>
													<h5 class="s-heading">Lorem Ipsum is simply dummy text printing </h5>
												</div>
                                               </div>
					                		</div>
					                	</div>
					                </div>
				              </div>
							  <script src="js/lightbox.js"></script>
						<!--//sreen-gallery-cursual-->
					</div>
				<!-- requried-jsfiles-for owl -->
							    <script src="js/owl.carousel.js"></script>
							        <script>
							    $(document).ready(function() {
							      $("#owl-demo").owlCarousel({
							        items :4,
							        lazyLoad : true,
							        autoPlay : true,
							        navigation : false,
							        navigationText :  false,
							        pagination : true,
							      });
							    });
							    </script>
							 
			 <!-- //requried-jsfiles-for owl -->
			 <div class="welcome text-center">
			<div class="container">
			    <h2>Welcome</h2>
				<p>Dolor nunc vule putateulr ips dol consec.Donec sem ertet laciniate ultricie upie disse utes comete dolo lectus. fgilla itollicil tua ludin dolor nec met quam accumsan. Dolore condime netus lullam utlacus adipiscing ipsum molestie euismod lore estibulum vel libero ipsum sit
				amet sollicitudin ante. Aenean imperdiet aliquet hendreritunc interdum ullamcorper lec tuset pellentesqu enim interdum atuspendisse malesuada dignissim.</p>
			 </div>
		</div>
<div class="copyrights">Collect from <a href="http://www.cssmoban.com/" >网页模板</a></div>
	<!--latest designs-->
<div id="cate" class="categories">
	 <div class="container">
		<div class="cat-head">
			<h3>Latest Designs</h3>
		</div>
		 <div class="categorie-grids cs-style-1">
				 <div class="col-md-4 cate-grid grid">
					<figure>
						<img src="images/c1.jpg" alt="">
						<figcaption>
					    <h3>standard chunk</h3>
							<span>Accusantium Dolor</span>
							<a class="example-image-link" href="images/c1.jpg" data-lightbox="example-1" data-title="Interior Design">VIEW</a>
						</figcaption>
					</figure>
				 </div>
				 <div class="col-md-4 cate-grid grid">
					 <figure>
						<img src="images/c2.jpg" alt="">
						<figcaption>
					    <h3>standard chunk</h3>
							<span>Accusantium Dolor</span>
							<a class="example-image-link" href="images/c2.jpg" data-lightbox="example-1" data-title="Interior Design">VIEW</a>
						</figcaption>
					</figure>
				 </div>


				 <div class="col-md-4 cate-grid grid">
					 <figure>
						<img src="images/c3.jpg" alt="">
						<figcaption>
					    <h3>standard chunk</h3>
							<span>Accusantium Dolor</span>
							<a class="example-image-link" href="images/c3.jpg" data-lightbox="example-1" data-title="Interior Design">VIEW</a>
						</figcaption>
					</figure>
				 </div>

				 <div class="col-md-4 cate-grid grid">
					<figure>
						<img src="images/c4.jpg" alt="">
						<figcaption>
					    <h3>standard chunk</h3>
							<span>Accusantium Dolor</span>
							<a class="example-image-link" href="images/c4.jpg" data-lightbox="example-1" data-title="Interior Design">VIEW</a>
						</figcaption>
					</figure>
				 </div>

				 <div class="col-md-4 cate-grid grid">
					<figure>
						<img src="images/c5.jpg" alt="">
						<figcaption>
					    <h3>standard chunk</h3>
							<span>Accusantium Dolor</span>
							<a class="example-image-link" href="images/c5.jpg" data-lightbox="example-1" data-title="Interior Design">VIEW</a>
						</figcaption>
					</figure>
				 </div>

				 <div class="col-md-4 cate-grid grid">
					 <figure>
						<img src="images/c6.jpg" alt="">
						<figcaption>
					    <h3>standard chunk</h3>
							<span>Accusantium Dolor</span>
							<a class="example-image-link" href="images/c6.jpg" data-lightbox="example-1" data-title="Interior Design">VIEW</a>
						</figcaption>
					</figure>
				 </div>

			 <div class="clearfix"></div>
		 </div>
	 </div>
</div>
<!--//latest designs-->
<!-- testimonials -->
<div class="second-slider">
	<div class="container">
	<h3 class="tes text-center">Testimonials</h3>
		<div  id="top" class="callbacks_container">
					<ul class="rslides" id="slider4">
						<li>
							<div class="sec-slid-info text-center">
								<img src="images/tes1.jpg" alt="" />
								<h4>lora germo</h4>
								<p>Nam mi enim, auctor non ultricies a, fringilla eu risus. Praesent vitae lorem et elit tincidunt accumsan suscipit eu libero.
								Nam mi enim, auctor non ultricies a</p>
							</div>
						</li>
						<li>
							<div class="sec-slid-info text-center">
								<img src="images/tes2.jpg" alt="" />
								<h4>suhiga</h4>
								<p>Man mi mine, rotcua non ultricies a, allignirf eu susir. Praesent viitae lorem et elit tincidunt accumsan suscipit ue bolero.
								Ultricies Nam mi enim, auctor non</p>
							</div>
						</li>
						<li>
							<div class="sec-slid-info text-center">
								<img src="images/tes3.jpg" alt="" />
								<h4>Singem Middile</h4>
								<p>Vam mi enim, risus non ultricies a, fringilla eu auctor. Vitae praesent lorem et elit accumsan tincidunt suscipit eu libero.
								Auctor Nam mi enim, auctor non</p>
							</div>
						</li>
					</ul>
		</div>
	</div>
</div>	
<!-- //testimonials -->
<!-- news -->
	<div class="news" id="blog">
		<div class="container">
			<div class="news-head text-center">
				<h3>Our Blog</h3>
				<p>Cras porttitor imperdiet volutpat nulla malesuada lectus eros ut convallis felis consectetur ut</p>
			</div>
			<div class="news-grids">
				<div class="col-md-4 news-grid">
					<a href="single.html">Interior design article post</a>
					<span>Posted by <a class="admin" href="#">Admin</a>on 09 JUN 2015</span>
					<a class="mask" href="single.html"><img src="images/img1.jpg" class="img-responsive zoom-img" alt="" /></a>
					<div class="news-info">
						<p>Pellentesque ut urna eu mauris scele risque auctor volutpat et massa pers piciis iste natus scele risque auctor volutpat et massa.</p>
						<a class="button" href="single.html"><img src="images/read.png" alt=""></a>
					</div>
				</div>
				<div class="col-md-4 news-grid">
					<a href="single.html">Interior design article post</a>
					<span>Posted by <a class="admin" href="#">Admin</a>on 24 SEP 2015</span>
					<a class="mask" href="single.html"><img src="images/img2.jpg" class="img-responsive zoom-img" alt="" /></a>
					<div class="news-info">
						<p>Pellentesque ut urna eu mauris scele risque auctor volutpat et massa pers piciis iste natus scele risque auctor volutpat et massa.</p>
						<a class="button" href="single.html"><img src="images/read.png" alt=""></a>
					</div>
				</div>
				<div class="col-md-4 news-grid">
					<a href="single.html">Interior design article post</a>
					<span>Posted by <a class="admin" href="#">Admin</a>on 15 FEB 2015</span>
					<a class="mask" href="single.html"><img src="images/img3.jpg" class="img-responsive zoom-img" alt="" /></a>
					<div class="news-info">
						<p>Pellentesque ut urna eu mauris scele risque auctor volutpat et massa pers piciis iste natus scele risque auctor volutpat et massa.</p>
						<a class="button" href="single.html"><img src="images/read.png" alt=""></a>
					</div>
				</div>
				<div class="col-md-4 news-grid">
					<a href="single.html">Interior design article post</a>
					<span>Posted by <a class="admin" href="#">Admin</a>on 10 JUN 2015</span>
					<a class="mask" href="single.html"><img src="images/img4.jpg" class="img-responsive zoom-img" alt="" /></a>
					<div class="news-info">
						<p>Pellentesque ut urna eu mauris scele risque auctor volutpat et massa pers piciis iste natus scele risque auctor volutpat et massa.</p>
						<a class="button" href="single.html"><img src="images/read.png" alt=""></a>
					</div>
				</div>
				<div class="col-md-4 news-grid">
					<a href="single.html">Interior design article post</a>
					<span>Posted by <a class="admin" href="#">Admin</a>on 09 JUN 2015</span>
					<a class="mask" href="single.html"><img src="images/img1.jpg" class="img-responsive zoom-img" alt="" /></a>
					<div class="news-info">
						<p>Pellentesque ut urna eu mauris scele risque auctor volutpat et massa pers piciis iste natus scele risque auctor volutpat et massa.</p>
						<a class="button" href="single.html"><img src="images/read.png" alt=""></a>
					</div>
				</div>
				<div class="col-md-4 news-grid">
					<a href="single.html">Interior design article post</a>
					<span>Posted by <a class="admin" href="#">Admin</a>on 24 SEP 2015</span>
					<a class="mask" href="single.html"><img src="images/img2.jpg" class="img-responsive zoom-img" alt="" /></a>
					<div class="news-info">
						<p>Pellentesque ut urna eu mauris scele risque auctor volutpat et massa pers piciis iste natus scele risque auctor volutpat et massa.</p>
						<a class="button" href="single.html"><img src="images/read.png" alt=""></a>
					</div>
				</div>
				<div class="clearfix"> </div>
			</div>
		</div>
	</div>
	<!-- //news -->
		<!-- footer-section -->
	<div class="footer">
		<div class="footer-top">
			<div class="container">
				<div class="col-md-4 footer-grid">
					<h5>About Us</h5>
					<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla in purus nibh. Donec ornare felis neque. Nullam tortor nulla, sodales quis posuere quis, tristique nec libero. Proin vitae convallis odio. Morbi nec enim nisi. Aliquam erat volutpat. </p>
				</div>
				<div class="col-md-4 footer-grid">
					<h5>Twitter Feed</h5>
					<p>Check out th best designs online in the world <br>at <a href="mail-to:mail@example.com">http://example.com </a></p>
					<span>1 day ago</span>
					<p><a href="#">Twitter</a>, may be the more visual platform for design inspiration.</p>
					<span>4 day ago</span>
				</div>
				<div class="col-md-4 footer-grid">
					<h5>Follow Us</h5>
					<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla in purus nibh. Donec ornare felis neque. Nullam tortor! </p>
					
			<div class="social-icons footer-social-icons">
				<a href="#"><i class="facebook"></i></a>
				<a href="#"><i class="twitter"></i></a>
				<a href="#"><i class="google-plus"></i></a>
			</div>
				</div>
				<div class="clearfix"></div>
			</div>
		</div>
		<div class="footer-bottom">
			<div class="container">
				<div class="copyrights col-md-10">
					<p>Copyright &copy; 2015.Company name All rights reserved.<a target="_blank" href="http://www.cssmoban.com/">&#x7F51;&#x9875;&#x6A21;&#x677F;</a></p>					
				</div>
				<div class="go-top col-md-2">
					<a href="#header" class="scroll"><span class="glyphicon glyphicon-chevron-up"></span></a>
				</div>
				<div class="clearfix"></div>
			</div>
		</div>
	</div>
	<!-- //footer-section -->
</body>
</html>